<%--
  Created by IntelliJ IDEA.
  User: tonghl
  Date: 2022/7/12
  Time: 11:11 上午
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>轮播图</title>
    <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
    <script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <link type="text/css" href="css/bootstrap.css">
</head>
<style>
    div.item img{
        width:100%;
    }
    div#carousel-example-generic{
        width:80%;
        margin:0 auto;
    }
</style>
<body>
<div id="myCarousel" class="carousel slide">
    <!-- 轮播（Carousel）指标 -->
    <ol class="carousel-indicators">
        <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
        <li data-target="#myCarousel" data-slide-to="1"></li>
        <li data-target="#myCarousel" data-slide-to="2"></li>
    </ol>
    <!-- 轮播（Carousel）项目 -->
    <div class="carousel-inner">
        <div class="item active">
            <img src="http://pic1.win4000.com/wallpaper/2019-02-21/5c6e434e8d2fb.jpg" >
            <div class="carousel-caption">标题 1</div>
        </div>
        <div class="item">
            <img src="http://pic1.win4000.com/wallpaper/2019-02-11/5c6137ee00320.jpg" >
            <div class="carousel-caption">标题 2</div>
        </div>
        <div class="item">
            <img src="http://pic1.win4000.com/wallpaper/2019-01-27/5c4d7aa191adb.jpg" >
            <div class="carousel-caption">标题 3</div>
        </div>
    </div>
    <!-- 轮播（Carousel）导航 -->
    <a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
    </a>
</div>
</body>
</html>
